<template>
	<view>
		<view style="background-color: transparent;overflow: hidden;position: relative;" :class="tyleClass"
			:style="'height:' + height + 'rpx;width:' + width + 'rpx'" @tap="addClick">
			<image v-if="value != ''" :src="value" mode="scaleToFill" style="height: 100%;width: 100%;"></image>
			<view class="flex align-center justify-center" v-else style="width: 100%;height: 100%;">
				<text class='cuIcon-cameraadd' :style="'font-size:' + height/2 + 'rpx;'"></text>
			</view>
			<slot></slot>
		</view>
	</view>
</template>

<script>
	export default {
		name: "yw-upfile-one",
		props: {
			rootPath: {
				type: String,
				required: true,
				default: "",
			},
			value: {
				type: String,
				default: (value) => {
					if (uni.$common.isBlank(value)) {
						return ""
					} else {
						return value
					}
				}
			},
			type: {
				type: String,
				default: ""
			},
			height: {
				type: Number,
				default: 100,
			},
			width: {
				type: Number,
				default: 100,
			}
		},
		data() {
			return {
				tyleClass: ""
			};
		},
		mounted() {
			this.$nextTick(() => {
				if (this.type == 'yuanxing') {
					this.tyleClass = "solids round"
				} else if (this.type == 'yuanjiao') {
					this.tyleClass = "solids yuanjiao"
				} else {
					this.tyleClass = ""
				}
			})
		},
		methods: {
			yulanClick(item, index) {
				uni.previewImage({
					urls: this.getImgs(),
					current: index
				});
			},
			addClick() {
				uni.chooseImage({
					count: 1,
					success: (res) => {
						console.log(JSON.stringify(res.tempFilePaths));
						uni.$api.upFile({
							file:res.tempFilePaths[0],
							rootPath:this.rootPath.toLowerCase()
						}).then((result) => {
							this.change(result.url)
						})
					}
				})
			},
			change(value) {
				this.$emit("input", value)
			},
		},
	}
</script>

<style lang="scss" scoped>
	.yuanjiao {
		border-radius: 30rpx;
	}
</style>
